<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>设备意外报损信息</title>
	<link rel="stylesheet" type="text/css" href="../../../resource/css/bootstrap.css">
	<link rel="stylesheet" type="text/css" href="../../../resource/css/user_css/publicStyle.css">
	<link rel="stylesheet" type="text/css" href="../../../resource/layui/css/layui.css"/>
	<link rel="stylesheet" type="text/css" href="../../../resource/css/niubility.css"/>
	<script type="text/javascript" src="../../../resource/layui/layui.js"></script>
	<!-- 购入、调入,调出，维修维护，报损报废相同的css样式 -->
	<link rel="stylesheet" type="text/css" href="../../../resource/css/user_css/purchase_diaoRu_style.css"/>
</head>
<body>
	<form action="" method="post" id="formAddDevice">
		<div class="boxOne">
			<div class="form-group">
				<label>请选择设备类别:</label>
				<select  class="form-control" name="equipmentCategory" id="category">
					<option value="-1">--未选择--</option>
				</select>
			</div>
			<div class="form-group" >
				<label>请选择设备名称:</label>
				<select  class="form-control" name="equipmentName" id="name">
					<option value="-1">--未选择--</option>
				</select>
			</div>
			<div class="form-group" >
				<label>请选择设备编号:</label>
				<select  class="form-control" name="equipmentNo" id="number">
					<option value="-1">--未选择--</option>
				</select>
			</div>
			<div class="form-group" >
				<label >报损原因:</label>
				<textarea name="damageReason" id="damageReason" class="form-control" style="width: 300px;height: 90px;"></textarea>
			</div>
		</div>
		<div class="boxOne">
			<div class="form-group">
				<label for="useYear">已使用年限:</label>
				<input  type="text"  class="form-control" name="useYear" id="useYear">
			</div>
			<div class="form-group">
				<label>报损或报废:</label>
				<select  class="form-control" name="damageOr" id="damageOr">
					<option value="-1">-未选择-</option>
					<option value="报损">报损</option>
					<option value="报废">报废</option>
				</select>
			</div>
			<div class="form-group">
				<label >报损日期:</label>
				<input type="date" class="form-control" name="damageDate" id="damageDate">
			</div>
			<!--最低报废年限： 隐藏掉-->
			<input  type="text"  style="display: none;" class="form-control" name="depreciationPeriod" id="depreciationPeriod">
		</div>
		<div style="clear: both;"></div>
	    <button type="button" class="btn btn-default" id="btn">提交</button>
	</form>
	<script type="text/javascript" src="../../../resource/js/jquery.min.js"></script>
	<!-- 静态url路径 -->
	<script type="text/javascript" src="../../../resource/js/static_url.js"></script>
	<!-- 表单序列化提交：购入、调入、调出、维修维护、报损报废、装让 -->
	<script type="text/javascript" src="../../../resource/js/user_js/user_post_serialize.js"></script>
	<!--************设备类别 + 设备名称 + 设备编号*****************-->
	<script type="text/javascript">
        /* -------------------三级联动： 调出 、维修维护 、报损报废-------------------*/
        $.ajax({
            type:"get",
            url: uri_three,
            async:true,
            dataType:"json",
            success:function(info){
                if(info.code != 0)
                {
                    layui.use('layer', function(){
                        var layer = layui.layer;
                        layer.msg(info.msg, {skin:'tip_position',time:'3000'});
                    });
                    return;
                }
                //拿到数组，通过$.each(index,value) ,将“ 设备类别 准备好 ”
                var infoData = info.data;
                var equipments;
                $.each(infoData,function(index,value){
                    $("#category").append("<option value="+index+">"+value.equipmentCategory+"</option>");
                });
                //监听“ 设备类别的改变 ”
                $("#category").bind('change',function(){
                    //清空 ，设备“ 名称和编号 ”
                    $("#name").empty();
                    $("#number").empty();
                    $("#name").append("<option value='-1'>--未选择--</option>");
                    $("#number").append("<option value='-1'>--未选择--</option>");
                    //拿到this.index ,找到下面的对象
                    equipments = infoData[this.value].equipments;
                    $.each(equipments,function(index,value){
                        $("#name").append("<option value="+index+">"+value.equipmentName+"</option>");
                    });
                });

                //监听“ 设备名字的改变 ”
                $("#name").bind('change',function(){
                    $("#number").empty();
                    $("#number").append("<option value='-1'>--未选择--</option>")
                    //比较我点击的 this.value 和 循环到的index是否相等
                    var indexValue = this.value;
                    $.each(equipments,function(index,value){
                        if(parseInt(indexValue) == index){

                            for(let a=0;a<value.equipmentNo.length;a++)
                            {
                                $("#number").append("<option value="+value.equipmentNo[a]+">"+value.equipmentNo[a]+"</option>");
                            }
                        }

                    });

                    $("#number").bind('change',function(){
                        var id = this.value;
                        $.ajax({
                            type:"get",
                            url: user_use_year+id,
                            async:true,
                            dataType:"json",
                            success:function(info){
                                if(info.code != 0)
                                {
                                    layui.use('layer', function(){
                                        var layer = layui.layer;
                                        layer.msg(info.msg, {skin:'tip_position',time:'3000'});
                                    });
                                    return;
                                }
                                // 获取节点
								$("#useYear").val(info.data.usedYear);
                                $("#depreciationPeriod").val(info.data.depreciationPeriod);
                            },
                            error:function(){
                                layui.use('layer', function(){
                                    var layer = layui.layer;
                                    layer.msg('系统错误！！！', {skin:'tip_position',time:'3000'});
                                });
                            }
                        })
					});
                    // 发起Ajax请求，拿到 该设备编号的使用年限

                });
            },
            error:function(){
                layui.use('layer', function(){
                    var layer = layui.layer;
                    layer.msg('系统错误！！！', {skin:'tip_position',time:'3000'});
                });
            }
        });
	</script>

	<!--表单验证-->
	<script type="text/javascript">
		$("#btn").click(function(){
			// 三级联动
            var category = $("#category").val();
            var name = $("#name").val();
            var number = $("#number").val();
            if(category==-1){
                layui.use('layer', function(){
                    var layer = layui.layer;
                    layer.tips('亲，要正确选择设备类别', '#category', {
                        tips: [1, '#333'],
                        time: 2500,
                    });
                });
                return;
            }
            if(name==-1){

                layui.use('layer', function(){
                    var layer = layui.layer;
                    layer.tips('亲，要正确选择设备名称', '#name', {
                        tips: [1, '#333'],
                        time: 2500,
                    });
                });
                return;
            }
            if(number==-1){
                layui.use('layer', function(){
                    var layer = layui.layer;
                    layer.tips('亲，要正确选择设备编号', '#number', {
                        tips: [1, '#333'],
                        time: 2500,
                    });
                });
                return;
            }

            /*
            报损报废的校验：
            （1）不能value不能==-1  （2）绑定change事件
            */
			if($("#damageOr").value == -1){
                layui.use('layer', function(){
                    var layer = layui.layer;
                    layer.tips('亲，您没有选择报损或报废哦', '#damageOr', {
                        tips: [1, '#333'],
                        time: 2500,
                    });
                });
				return;
			}

			// 如果选择的是报废： 报废的最低年限 > 使用年限不能提交
            if($("#damageOr").val() == '2'){ //报废
                if($("#depreciationPeriod").val() > $("#useYear").val()){
                    layui.use('layer', function(){
                        var layer = layui.layer;
                        layer.msg('亲，您的设备还没到最低报废年限', {skin:'tip_position',time:'2000'});
                    });
                    return ;
                }
            }

            // 报损日期（此处指的是主动报损）: (1)不能为空（2）不能大于当前时间
			var damageDate = $("#damageDate").val();
            if(damageDate==''){
                layui.use('layer', function(){
                    var layer = layui.layer;
                    layer.tips('亲，请填写报损日期', '#damageDate', {
                        tips: [1, '#333'],
                        time: 2500,
                    });
                });
                return;
			}
            // 表单中填写的时间
            var db = new Date(damageDate.replace(/-/g,"/"));
            // 当前时间
			var d = new Date();
            var str = d.getFullYear()+"-"+(d.getMonth()+1)+"-"+d.getDate();
            // console.log(db+", "+d);
            if(Date.parse(db)>Date.parse(str)){
                alert('亲，您填写的时间 ，大于当前时间');
                return;
			}
            // 报损原因： （1）长度不超过150
			var damageReason = $("#damageReason").val();
            if(damageReason.length>150){
                layui.use('layer', function(){
                    var layer = layui.layer;
                    layer.tips('亲，报损原因长度不能超过150个字符', '#damageReason', {
                        tips: [1, '#333'],
                        time: 2500,
                    });
                });
                return;
			}

            //--- 提交数据
            post_serialize(user_damage_post);
		})

		// 设置默认时间
		var myDate = new Date();
		var year = myDate.getFullYear();
		var month = myDate.getMonth()+1;
		var day = myDate.getDate();
		//判断 月份、天数 <10的时候前面加 0
		if(month < 10){
			month = "0"+month;
		}
		if(day < 10){
			day = "0"+day;
		}
		var time = year +"-"+ month +"-"+ day;
		$("#damageDate").val(time);
	</script>
</body>
</html>